import { Link } from 'react-router-dom'
import React, { Component } from 'react';
import './Head.css';
import logo_t from './img/logo_t.svg'
class Head extends Component {
  constructor(props) {
    super(props);
    this.state = {
      class0: props.childrenIndex === 0 ? 'active' : "",
      class1: props.childrenIndex === 1 ? 'active' : "",
      class2: props.childrenIndex === 2 ? 'active' : "",
      class3: props.childrenIndex === 3 ? 'active' : "",
      class4: props.childrenIndex === 4 ? 'active' : ""

    }
  }
  render() {
    return (
      <div>
        <header>
          <img src={logo_t} alt="" />
          <div className="fr">
            <input type="text" className="search" />
            <span className="line">|</span>
            <span className="uploadApp">下载APP</span>
            <span className="line">|</span>
            <span className="login"><Link to="/About">登陆</Link></span>
            <span className="register"><Link to="/About">注册</Link></span>

          </div>
        </header>
        <div className="head">
          <nav>
            <ul>
              <li className={this.state.class0}><Link to="/">首页</Link></li>
              <li className={this.state.class1}><Link to="/About">公务出行</Link></li>
              <li className={this.state.class2}><Link to="/About">观光飞行</Link></li>
              <li className={this.state.class3}><Link to="/About">通勤航旅</Link></li>
              <li className={this.state.class4}><Link to="/About">飞行培训</Link></li>
              <li><Link to="/About">空中论坛</Link></li>
              <div className="clear"></div>
            </ul>
          </nav>
        </div>
      </div>
    )
  }
}

export default Head;
